<!DOCTYPE html>
<!-- 声明文档类型-->
<html lang="en">
<!-- 确定语言形态 -->

<head>
    <meta charset="UTF-8">
    <!--控制网页的编码格式 utf-8 国际性编码-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--控制视口比例以及缩放-->
    <title>题目列表</title>
    <!-- 先引入重置样式表和公共样式表以及主页样式表 -->
    <!-- <link rel="stylesheet" href="../wwwroot/index.css"> -->
    <link rel="stylesheet" href="./public.css">
    <!-- <link rel="stylesheet" href="../wwwroot/reset.css"> -->
    <!-- 这个顺序引入更规范 -->

    <style>
        * {
            /* 消除网页的默认外边距 */
            margin: 0px;
            /* 消除网页的默认内边距 */
            padding: 0px;
        }

        html,
        body {
            width: 100%;
            height: 100%;
        }

        /* 设置鼠标事件 */
        .container .nav_con a:hover {
            background-color: rgb(178, 188, 194);
        }

        .container .navbar .login {
            float: right;
        }

        .container .question_list {
            padding-top: 50px;
            width: 800px;
            height: 100%;
            margin: 0px auto;
            /* background-color: #ccc; */
            text-align: center;
        }

        .container .question_list table {
            width: 100%;
            font-size: large;
            font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'LucidaSans Unicode', Geneva, Verdana, sans-serif;
            margin-top: 50px;
            background-color: rgb(237, 241, 243);
        }

        .container .question_list h1 {
            color: rgb(236, 217, 205);
        }

        .container .question_list table .item {
            width: 100px;
            height: 40px;
            font-size: large;
            font-family: 'Times New Roman', Times, serif;
        }

        .container .question_list table .item a {
            text-decoration: none;
            color: black;
        }

        .container .question_list table .item a:hover {
            color: blue;
            text-decoration: underline;
        }

        .container .footer {
            width: 100%;
            height: 50px;
            text-align: center;
            line-height: 50px;
            color: #ccc;
            margin-top: 15px;
        }
    </style>
</head>

<body>
    <div class="container">
        <div id="nav">
            <!-- 导航栏版心部分 -->
            <div class="nav_con">
                <ul>
                    <li class="margin-left"><a href="http://175.178.42.143:8080/">首页</a></li>
                    <li><a href="/questions_list">题库</a></li>
                    <li><a href="#">社区</a></li>
                    <li><a href="#">求职</a></li>
                    <li><a href="#">讨论</a></li>
                    <li><a href="https://blog.csdn.net/weixin_57371426?type=blog">博客</a></li>
                    <li><a href="https://gitee.com/sirudoi">码云<br></a></li>
                    <li><a href="#">登录</a></li>
                </ul>
            </div>
        </div>


        <div class="question_list">
            <h2>我的OnlineJudge题目列表</h2>
            <table>
                <tr>
                    <th>编号</th>
                    <th>标题</th>
                    <th>难度</th>
                </tr>
                {{#question_list}}
                <tr>
                    <td>{{number}}</td>
                    <td><a href="/question/{{number}}">{{title}}</a></td>
                    <td>{{difficulty}}</td>
                </tr>
                {{/question_list}}
            </table>
        </div>

        <div class="footer">
            <!-- <hr> -->
            <h4>@我的OnlineJudge</h4>
        </div>

    </div>

</body>

</html>